<template>
	<div class="aui-row hot_recommend homefeaturedgood" style="margin-bottom: 0.4rem;">
		<div class="aui-col-xs-6 featuredgoodimg" v-if="FeaturedGoodsData.length" v-for="(item, index) in FeaturedGoodsData" :key="index">
			<img v-lazy="item.publicityPicture" @click='jumpEvent(item)'/>
		</div>
	</div>
</template>

<script>
	export default {
		props: {
			FeaturedGoodsData: {
				type: Array,
				default: () => []
			},
			page: {
				type: String,
				default: 'other'
			},
		},
		data() {
			return {
				pageTree: [],
			}
		},
		methods: {
			jumpEvent(item) {
				if(this.page === 'newPage'&& item.extendField) {
					var urldata = JSON.parse(item.extendField).url.path
					this.$router.push({
						path: urldata
					})
				} else {
					// 跳到商品详情
					this.$router.push({
						path: 'searchResult?clue=' + item.relType
					})
				}

			},
		},
		watch:{
			FeaturedGoodsData(val){
				console.log("打印---", val)
			}
		},

		created() {
			// alert(11)
			console.log("打印数据", this.FeaturedGoodsData)
		},
		mounted() {
		}
	}
</script>

<style>
	.hot_recommend{
		margin-right: 0px;
	}
	.hot_recommend img {
		height: auto;
		width: auto;
	}
	
	.homefeaturedgood {
		background-color: #fff;
		margin-bottom: 0rem;
		padding: 0.65rem;
	}
	
	.homefeaturedgood .featuredgoodimg {
		width: 30%;
		padding: 0.1rem;
		height: 4.55rem;
		display: flex;
		align-items: center;
		justify-content: center;
		/*float: right;*/
	}
	.homefeaturedgood .featuredgoodimg img{
		position: relative;
		/*max-height: 4.35rem;
		max-width: 100%;*/
		height: 100%;
		width: 100%;
	}
	.hot_recommend .aui-col-xs-6{
		border:none;
	}
	.homefeaturedgood .featuredgoodimg:first-child,
	.homefeaturedgood .featuredgoodimg:nth-child(2),
	.homefeaturedgood .featuredgoodimg:nth-child(4) {
		border:none;
	}
	
	.homefeaturedgood .featuredgoodimg:first-child {
		width: 40%;
		height: 9.1rem;
		/*float: left;*/
		/*margin-right: 0px;*/
	}
	
	.homefeaturedgood .featuredgoodimg:first-child img {
		max-height: 9.1rem;
		max-width: 100%;
	}
</style>